import React, {Component} from 'react';
import '../css/component.css';

class MenuItem extends Component {
    constructor(props) {
        super(props);
        this.state = {}
    }

    render() {
        const {title, content, pictureUrl, direction1, direction2} = this.props;
        return (
            <div className="MenuItemStyle">
                <div className={direction1==="left"?"contentStyle1":"contentStyle"} style={{float: direction1}}>
                    <div className={direction1==="left"?"titleStyle1":"titleStyle"}>{title}</div>
                    <div className={direction1==="left"?"contextStyle1":"contextStyle"}>
                        {content}
                    </div>
                    {/*<div className={direction1==="left"?"detailStyle1":"detailStyle"} onClick={() => this.handleRedirect()}>*/}
                        {/*了解详情*/}
                    {/*</div>*/}
                </div>
                <div className="imgStyle" style={{float: direction2}}>
                    <img src={pictureUrl} alt="jpg"/>
                </div>
            </div>
        )
    };

    /**
     * 跳转
     */
    handleRedirect() {
        console.log(33);
    }
}

export default MenuItem;